<template>
  <div class="mainBox marT20">
    <div class="marB25" v-for="(i, k) in data" :key="k">
      <!-- <div class="fontS20 fonBold marB20">
        {{ i }}
      </div> -->
      <a-alert :message="i.pld" type="warning" v-if="i.title ==='项目简介'||i.title ==='主要技术创新点'"/>
      
      <div v-if="i.title=='应用单位目录'||i.title=='技术评价证明及国家发律法规要求行业审批文件目录'||i.title=='知识产权证明目录'">
      <a-tag color="orange">
        {{i.title}}
      </a-tag>
      <div v-if="i.title=='技术评价证明及国家发律法规要求行业审批文件目录'">
        <div style="margin-bottom:10px"></div>
        <hr>
      </div>
      </div>
      <a-textarea
        :class="{ textArea: data.length == 1 }"
        :placeholder="i.pld"
        :maxLength="800"
        v-model="$store.state.declare[i.ajaxStr]"
        :autosize="{ minRows: 5, maxRows: 10 }"
        v-if="!i.itemSolt &&i.show"
        :disabled="$store.state.iptDis"
      />
      
      <tinymce v-if="!i.show" :class="{ textArea: data.length == 1 }" v-model="$store.state.declare[i.ajaxStr]" :key="tinymceFlag" id="myedit" ref="Tinymce" ></tinymce>
      
      <slot :name="`itemMain${k}`"></slot>
      
      
    </div>
    <slot name="main"></slot>
  </div>
</template>

<script>
import Tinymce from '@/components/tinymce/tinymce.vue'; // 富文本
export default {
  components: {
      Tinymce,
     
  },
  props: {
    data: {
      default: () => {},
    },
  },
  data(){
    return {
       // 是否显示弹出层
      open: false,
      tinymceFlag: 1,//是防止组件缓存导致编辑器不能正常使用，每次切换来都更改key,使其重新渲染
    }
  },
  created() {
    // tinymce 内容不显示
    // eventBus.$on('activatedTow', this.activatedTow)
  },
  beforeDestroy() {
      // 销毁组件前销毁编辑器
      this.tinymce  && this.tinymce.destroy();
    },
  activated() {
 // 每次都给编辑器改变不同的key值使其每次切换页面都重新加载
      console.log("--->",this.tinymceFlag)
      this.tinymceFlag++;
    },

};
</script>

<style lang="scss" scoped>
.mainBox {
  border: 1px solid #b8babd;
  padding: 25px;
  box-sizing: border-box;
  border-radius: 12px;
}
.ant-input {
  border: 0;
}
.ant-input:hover {
  border-color: #40a9ff;
  border-right-width: 0px !important;
}
.textArea {
  height: 480px;
}
</style>